<template>
  <van-row>
    <van-col span="24">
      <!-- 分页查询商家信息 -->
        <van-list
          v-model:loading="loading"
          :finished="finished"
          finished-text="没有更多了"
          @load="getBusinessByPage"
        >
          <van-row style="margin-top:50px; cursor: pointer;" v-for="business in list" :key="business.businessId"
          @click="goFoodView(business.businessId)">
              <van-col :span="8" align="center">
                <img :src="business.businessImg" style="width: 60%;height: 60px;">
              </van-col>
              <van-col :span="16" align="left" >
                  <div style="font-size: 16px;">{{business.businessName}}</div>
                  <div style="font-size: 12px;">{{business.businessExplain}}</div>
                  <div style="font-size: 12px;">{{business.businessAddress}}</div>
              </van-col>
          </van-row>
        </van-list>
    </van-col>
  </van-row>
</template>
<script setup>
    import { getCurrentInstance,ref } from 'vue';
    import { showNotify } from 'vant';
    const {proxy}=getCurrentInstance();

    const list = ref([]);
    //加载的状态，查询之前设置为true，查询完之后 设置为false
    const loading = ref(false);
    //所有的数据全部查询完之后为true
    const finished = ref(false);

    //分页查询商家 

    let query=ref({
        pageNow:0,
        pageCount:5,
        businessName:''
    })
    let pb=ref({
        totalRows:0,
        data:[]
    })
    const getBusinessByPage =()=>{

        loading.value = true;
        query.value.pageNow+=1;
        //直接开始发送请求
       setTimeout(()=>{
        proxy.$axios({
            method:'post',
            url:'/business/page',
            data:query.value
        }).then(res=>{
            loading.value=false;

            let resultBean=res.data;
            if(resultBean.code==200) {
                pb.value=resultBean.data;
                //对pb中数据进行循环插入到list中，在页面上进行显示
                pb.value.data.forEach((business)=>{
                  list.value.push(business);
                })
                //判断是否将数据查完
                console.log('-------------',list.value.length,pb.value.totalRows);
                if(list.value.length==pb.value.totalRows) {
                  finished.value=true;
                }
            } else {
                showNotify({message:resultBean.msg});
            }
        }).catch(error=>{
        
            showNotify({message:error.message});
        });
       },1000)
    }
    const goFoodView=(bid)=>{
        console.log('商家编号'+bid);
        proxy.$router.push('/main/food/'+bid);
    }
</script>
<style scoped>

</style>
